<template>

 <view class="const">
 	 <draggable element="view" v-model="listdata">
	   <li v-for="(item,index) in listdata" @click="btn(item.id)" class="SortItem">{{item.name}}</li>
	  </draggable>
 </view>
</template>

<script> 
import axios from  'axios'
import $ from 'jquery'
import {listdata} from './list.js'
import {rout} from './router.js'
import draggable from 'vuedraggable'
	export default {
		 components: {
		     draggable
		  },
		data() {
			return {
				time:"",
				ip:"",
				 listdata:listdata
			}
		},
		methods: {
btn(index){
	rout(index)
}
		}
	}
</script>

<style>
	.const{
		height:76vh;
		/* width: 750rpx; */
		border-radius: 44rpx 44rpx 44rpx 44rpx;
		margin-bottom: 40rpx;
		background:#F0F0F0;
		padding: 30rpx 0rpx 0 0rpx;
	}
	.SortItem {
		width: 43%;
		height: 60rpx;
		float: left;
		/* border: 2rpx solid #4CD964; */
		background: blue;
		box-sizing: border-box;
		margin-left: 30rpx;
		list-style: none;
		margin-bottom: 20rpx;
		line-height: 60rpx;
		color: #F0F0F0;
		text-align: center;
		border-radius: 14rpx 14rpx 14rpx 14rpx;
	}

	.SortItem:hover {
		box-shadow: 0px 6px 9px #888888;
	}
</style>
